import React, {
  Component,
  useState,
  useEffect,
} from "react";
import {
  View,
  Text,
  Image,
  TouchableHighlight,
  ScrollView,
} from "react-native";
import Content from "../../components/content/content";
import styles from "./task-account-sheet";
import {
  platform,
} from "../../baseData";

const ImgName = 'order';

export default function TaskAccount(props) {

  router = (type) => {
    props.navigation.navigate('AccountList', {
      type,
    });
  }

  renderDate = () => {
    return Object.keys(platform).map(v => {
      if (v === ImgName) {
        return null;
      }
      return (
        <TouchableHighlight key={v} underlayColor="#e6e6e6" onPress={router.bind(this,v)} style={{width:'33.33%'}}>
          <View style={[styles.listItem]}>
            <View>
              <Image resizeMode="contain" style={styles.icon} source={platform[ImgName].image} />
            </View>
            <View>
              <Text style={styles.platformName}>
                {platform[v].name}
              </Text>
            </View>
          </View>
        </TouchableHighlight>
      )
    });
  }

  return (
    <Content>
      <ScrollView style={{flex:1}}>
        <View style={styles.content}>
        {
         renderDate()
        }
        </View>
      </ScrollView>
		</Content>
  )
}